<template>
  <div>
    <MyTable
      :arr="list"
      :Mystyle="{
        backgroundColor: 'blue',
        color: 'white',
        border: '#ec4341',
        borderRadius: '10%',
      }"
     
   
    >
      <template v-slot="socp">
        <button :style="obj" @click="DelBtn(socp.btns)">删除</button>
      </template>
    </MyTable>
  </div>
</template>

<script>
import MyTable from './MyTable'
export default {
  components: {
    MyTable,
  },
  data() {
    return {
      list: [], // 所有数据
      obj: {
        backgroundColor: '#ec4341',
        color: 'white',
        border: '#ec4341',
        borderRadius: '10%',
        fontSize: '14px',
      },
    }
  },
  created() {
    this.$axios({
      url: '/api/goods',
      method: 'GET',
    }).then((res) => {
      let {
        data: { data },
      } = res
      this.list = data
      console.log(this.list)
    })
  },
  methods: {
    DelBtn(socp) {
      this.list = this.list.filter((item) => {
        return item.id !== socp
      })
    },
    
  },
}
</script>
<style></style>
